var pageNum = 1;
var pageSize = 10;
var isfirst = true;

function getTemplateList() {
  $(".marklayer").addClass("mark-show");
  var keyword = $(".search-website").val();
  $.ajax({
    method: "GET",
    url: baseUrl + "/template/page",
    contentType: "application/json",
    dataType: "json",
    data: {
      pageNum,
      pageSize,
      keyword,
    },
    success: function (res) {
      $(".marklayer").removeClass("mark-show");
      if (res.code == 200) {
        renderTableList(res.result.list);

        if (res.result.list.length == 0) {
          $(".table_empty").css("display", "flex");
        } else {
          $(".table_empty").css("display", "none");
        }

        if (isfirst) {
          pagination(res.result.total);
          isfirst = false;
        }
      }
    },
  });
}

getTemplateList();

function renderTableList(data) {
  var strHtml = "";
  data.forEach((item, index) => {
    strHtml += `<tr>
                              <td>${item.template_name}</td>
                              <td>${item.create_user_name}</td>
                              <td>${item.create_time}</td>
                              <td><span class="badge ${
                                item.status == 0
                                  ? "text-bg-success"
                                  : "text-bg-danger"
                              }">${
      item.status == 0 ? "已上架" : "已下架"
    }</span></td>
                              <td>${item.temp_use_count}</td>
                              <td class="center">
                              <button type="button" class="btn btn-link ${
                                item.status == 1
                                  ? "text-success"
                                  : "text-danger"
                              }" onclick="controlTemplate(${JSON.stringify(
      item
    ).replace(/"/g, "&quot;")})">${item.status == 1 ? "上架" : "下架"}</button>|
    <button type="button" class="btn btn-link"  onclick="editTemplate(${JSON.stringify(
      item
    ).replace(/"/g, "&quot;")})">编辑</button>
                              </td>
                          </tr>`;
  });
  $(".table-content").html(strHtml);
}

function pagination(total) {
  layui.use("laypage", function () {
    var laypage = layui.laypage;

    //执行一个laypage实例
    laypage.render({
      elem: "pagination",
      count: total,
      limit: 10,
      groups: 3,
      layout: ["count", "prev", "page", "next", "skip"],
      jump: function (obj) {
        if (pageNum == obj.curr) {
          return;
        }
        pageNum = obj.curr;
        getTemplateList();
      },
      theme: "#0d6efd",
    });
  });
}

var templateStatus;
var templateId;
function controlTemplate(item) {
  templateStatus = item.status;
  templateId = item.id;
  if (item.status == 1) {
    $("#controlModal .col-form-label").html("确定要上架该模板吗？");
  } else {
    $("#controlModal .col-form-label").html("确定要下架该模板吗？");
  }
  $("#controlModal").modal("show");
}

function submitControl() {
  if (templateStatus == 1) {
    templateStatus = 0;
  } else {
    templateStatus = 1;
  }
  $("#controlModal").modal("hide");
  $.ajax({
    method: "GET",
    url: baseUrl + "/template/open",
    contentType: "application/json",
    dataType: "json",
    data: {
      id: templateId,
      status: templateStatus,
    },
    success: function (res) {
      if (res.code == 200) {
        getTemplateList();
        $(".message-success .message_content").html(res.msg);
        $(".message-success").removeClass("message-hide");
        setTimeout(() => {
          $(".message-success").addClass("message-hide");
        }, 2000);
      }
    },
  });
}

$(".run-environment span").each(function () {
  $(this).click(function () {
    if ($(this).hasClass("active")) {
      $(this).removeClass("active");
    } else {
      $(".run-environment span").each(function () {
        $(this).removeClass("active");
      });
      $(this).addClass("active");
    }
  });
});

$(".collect-type span").each(function () {
  $(this).click(function () {
    if ($(this).hasClass("active")) {
      $(this).removeClass("active");
    } else {
      $(".collect-type span").each(function () {
        $(this).removeClass("active");
      });
      $(this).addClass("active");
    }
  });
});

function addTemplate() {
  window.open("/page/spiderTemplate/template.html");
}

function editTemplate(item) {
  window.open(
    "/page/dataCollect/template.html?id=" +
      item.id +
      "&name=" +
      item.template_name
  );
}
